@extends('layout.home.main')
@section('content')
    <section class="content post-single pt-70 pt-mdm-60">
        <div class="container relative">
            <div class="row">
                <div class="col-md-9 post-content mb-50">

                    <!-- large post -->
                    <article class="entry-item large-post">

                        <div class="entry-header">
                            <a href="#" class="entry-category">{{$article->cate->name}}</a>
                            <h1 class="entry-title">{{$article->title}}</h1>
                        </div>

                        <div class="entry-img">
                            <img src="{{$article->image}}" alt="">
                        </div>

                        <div class="entry-wrap">
                            <div class="entry">

                                <div class="entry-content">
                                    <div class="article">
                                        {!! $article->content !!}
                                    </div>

                                    <!-- tags -->
                                    <div class="entry-tags tags mb-50 mt-40 clearfix">
                                        @foreach($article->tags as $tag)
                                        <a href="#">{{$tag->name}}</a>
                                        @endforeach
                                    </div>

                                    <div class="entry-meta-wrap clearfix">
                                        <ul class="entry-meta">
                                            <li class="entry-date">
                                                <a href="#">{{$article->created_at->diffForHumans()}}</a>
                                            </li>
                                            <li class="entry-comments">
                                                <a href="blog-single.html">{{$article->answers->count()}} Comments</a>
                                            </li>
                                        </ul>

                                    </div>

                                    <!-- entry author -->
                                    @if($article->hotAnswer)
                                    <div class="entry-author-box clearfix">
                                        <img src="/images/face.png" class="author-img" alt="img">
                                        <div class="author-info">
                                            <h6 class="author-name"><a href="#">{{$article->hotAnswer->name}}</a></h6>
                                            <p class="mb-0">
                                                {{$article->hotAnswer->content}}
                                            </p>
                                        </div>
                                    </div>

                                    @endif

                                    <!-- related posts -->
                                    <div class="related-posts mt-40">
                                        <div class="heading-lines mb-30">
                                            <h3 class="heading small">相关 文章</h3>
                                        </div>
                                        <div class="row">
                                            @foreach($article->cate->hotArticle() as $hotArticle)
                                            <div class="col-sm-4">
                                                <article class="entry-item">
                                                    <div class="entry-img">
                                                        <a href="blog-single.html">
                                                            <img src="{{$hotArticle->image}}" alt="">
                                                        </a>
                                                    </div>
                                                    <h4 class="entry-title">
                                                        <a href="blog-single.html">{{$hotArticle->title}}</a>
                                                    </h4>
                                                    <div class="entry-meta-wrap clearfix">
                                                        <ul class="entry-meta">
                                                            <li class="entry-date">
                                                                <a href="#">{{$hotArticle->created_at->diffForHumans()}}</a>
                                                            </li>
                                                        </ul>
                                                    </div>
                                                </article>
                                            </div>
                                                @endforeach
                                        </div>
                                    </div>

                                    <!-- Comments -->
                                    <div class="entry-comments mt-20">
                                        <div class="heading-lines mb-30">
                                            <h3 class="heading small">{{$article->answers->count()}} comments</h3>
                                        </div>

                                        <ul class="comment-list">
                                            @foreach($article->answers as $answer)

                                            <li>
                                                <div class="comment-body">
                                                    <img src="/images/face.png" class="comment-avatar" alt="">
                                                    <div class="comment-content">
                                                        <span class="comment-author">{{$answer->name}}</span>
                                                        <span class="comment-date">{{$answer->created_at->diffForHumans()}}</span>
                                                        <p>
                                                            {!! $answer->content !!}
                                                        </p>
                                                        <a href="#">Reply</a>
                                                    </div>
                                                </div>
                                            </li> <!-- end 3 comment -->

                                                @endforeach

                                        </ul>
                                    </div> <!--  end comments -->

                                    <!-- Leave a Comment -->
                                    <div class="comment-form mt-60">
                                        <div class="heading-lines mb-30">
                                            <h3 class="heading small">留下回复</h3>
                                        </div>
                                        <form id="form" method="post" action="/answer/create">
                                            <div class="row row-16">
                                                <div class="col-md-4">
                                                    <input name="name" id="name" type="text" placeholder="Name*">
                                                </div>
                                                <div class="col-md-4">
                                                    <input name="email" id="mail" type="email" placeholder="E-mail*">
                                                </div>
                                                <div class="col-md-4">
                                                    <input name="website" id="Website" type="text" placeholder="Website">
                                                </div>
                                                <div class="col-md-12">
                                                    <textarea name="content" id="content" placeholder="Comment" rows="8"></textarea>
                                                </div>
                                            </div>

                                            <input type="hidden" name = article_id value="{{$article->id}}">

                                            <input type="submit" class="btn btn-lg btn-color mt-20" value="提交" id="submit-message">
                                        </form>
                                    </div>

                                </div>
                            </div>
                        </div>
                    </article> <!-- end large post -->
                </div> <!-- end col -->
    @section('sidebar')
        @include('layout.home.sidebar')

    @endsection

@endsection
